<template>
  <div class="nav">
    <img src="../assets/logo.png" alt="">
    <Input style="width: 240px" placeholder="搜索问题、话题或人..." ><Icon type="ios-search" color="#2d8cf0" slot="suffix"/></Input>
    <Menu mode="horizontal" theme="primary" active-name="1" @on-select="select">
        <MenuItem name="1">
            <Icon type="ios-paper" />
            发现
        </MenuItem>
        <MenuItem name="2">
            <Icon type="ios-people" />
            择校
        </MenuItem>
        <MenuItem name="3">
            <Icon type="ios-stats" />
            数据
        </MenuItem>
        <MenuItem name="4">
            <Icon type="ios-construct" />
            资料
        </MenuItem>
        <Submenu name="5">
            <template slot="title">
                ...
            </template>
            <MenuGroup title="使用">
                <MenuItem name="3-1">新增和启动</MenuItem>
                <MenuItem name="3-2">活跃分析</MenuItem>
                <MenuItem name="3-3">时段分析</MenuItem>
            </MenuGroup>
            <MenuGroup title="留存">
                <MenuItem name="3-4">用户留存</MenuItem>
                <MenuItem name="3-5">流失用户</MenuItem>
            </MenuGroup>
        </Submenu>
    </Menu>
    <Button type="info" @click="login('login')">登录</Button>
    <Button type="success" @click="login('register')">注册</Button>
  </div>
</template>

<script>
export default {
  name: 'Nav',
  data () {
    return {
        
    }
  },
  methods:{

  }
}
</script>

<style scoped>
    .nav{
        background: #2d8cf0;
        padding-left: 15%;
        padding-right:15%;
        height: 60px;
        line-height: 60px;
        width: 100%;
        float: left;
    }
    img,div,ul{
        float: left;
        margin-right: 10px;
    }
    .nav>div{
        margin-top: 14px;
    }
    img{
        height: 60px;
    }
    .ivu-menu-primary>.ivu-menu-item-active{
        background: rgb(45, 120, 240);
    }
</style>